{{ define "config.html" }}

<body>
  <div class="container-lg">
    <div class="row">
      <div class="col-md mt-4">
        <div class="card border-primary">
          <div class="card-header">Basic config</div>
          <div class="card-body table-responsive">
            <table class="table table-borderless">
              <form action="/config/" method="post">
                <tr>
                  <td>Host</td>
                  <td><input name="host" type="text" class="form-control" value="{{ .Config.Host }}"></td>
                </tr>
                <tr>
                  <td>Port</td>
                  <td><input name="port" type="text" class="form-control" value="{{ .Config.Port }}"></td>
                </tr>
                <tr>
                  <td>Theme</td>
                  <td><select name="theme" class="form-select">
                    <option selected>{{ .Config.Theme }}</option>
                    {{ range .Themes }}
                        <option value="{{ . }}">{{ . }}</option>
                    {{ end }}
                  </select></td>
                </tr>
                <tr>
                  <td>Color mode</td>
                  <td><select name="color" class="form-select">
                    <option selected>{{ .Config.Color }}</option>
                    <option value="light">light</option>
                    <option value="dark">dark</option>
                  </select></td>
                </tr>
                <tr>
                  <td>Local node-bootstrap URL</td>
                  <td><input name="node" type="text" class="form-control" value="{{ .Config.NodePath }}"></td>
                </tr>
                <tr>
                  <td>Shoutrrr URL</td>
                  <td>
                    <textarea name="shout" class="form-control" style="width: 100%;" rows="3" wrap="soft">{{ .Config.ShoutURL }}</textarea>
                  </td>
                </tr>
                <tr>
                  <td><button type="submit" class="btn btn-primary">Save</button></td>
                  <td></td>
                </tr>
              </form>
            </table>
          </div>
        </div>

        <div class="card border-primary mt-4 mb-4">
          <div class="card-header">Scan settings</div>
          <div class="card-body table-responsive">
            <table class="table table-borderless">
              <form action="/config_settings/" method="post">
                <tr>
                  <td>Interfaces</td>
                  <td><input name="ifaces" type="text" class="form-control" value="{{ .Config.Ifaces }}"></td>
                </tr>
                <tr>
                  <td>Timeout (seconds)</td>
                  <td><input name="timeout" type="number" class="form-control" value="{{ .Config.Timeout }}"></td>
                </tr>
                <tr>
                  <td>Args for arp-scan</td>
                  <td><input name="arpargs" type="text" class="form-control" value="{{ .Config.ArpArgs }}"></td>
                </tr>
                <tr>
                  <td>Arp Strings</td>
                  <td>{{ range .Config.ArpStrs }}
                    <input name="arpstrs" type="text" class="form-control" value="{{ . }}">{{ end }}
                    <input name="arpstrs" type="text" class="form-control">
                  </td>
                </tr>
                <tr>
                  <td>Log level</td>
                  <td><select name="log" class="form-select">
                    <option selected>{{ .Config.LogLevel }}</option>
                    <option value="debug">debug</option>
                    <option value="info">info</option>
                    <option value="warn">warn</option>
                    <option value="error">error</option>
                  </select></td>
                </tr>
                <tr>
                  <td>Trim History (hours)</td>
                  <td><input name="trim" type="number" class="form-control" value="{{ .Config.TrimHist }}"></td>
                </tr>
                <tr>
                  <td>Store History in DB</td>
                  <td>
                    <div class="form-check form-switch">
                      {{ if .Config.HistInDB }}
                      <input class="form-check-input" type="checkbox" name="histdb" checked>
                      {{ else }}
                      <input class="form-check-input" type="checkbox" name="histdb">
                      {{ end }}
                    </div>
                  </td>
                </tr>
                <tr>
                  <td>Use DB</td>
                  <td><select name="usedb" class="form-select">
                    <option selected>{{ .Config.UseDB }}</option>
                    <option value="sqlite">sqlite</option>
                    <option value="postgres">postgres</option>
                  </select></td>
                </tr>
                <tr>
                  <td>PG Connect URL</td>
                  <td>
                    <textarea name="pgconnect" class="form-control" style="width: 100%;" rows="3" wrap="soft">{{ .Config.PGConnect }}</textarea>
                  </td>
                </tr>
                <tr>
                  <td><button type="submit" class="btn btn-primary">Save</button></td>
                  <td></td>
                </tr>
              </form>
            </table>
          </div>
        </div>
      </div>
        
      <div class="col-md mt-4 mb-4">
        <div class="card border-primary">
          <div class="card-header">InfluxDB2 config</div>
          <div class="card-body table-responsive">
            <table class="table table-borderless">
              <form action="/config_influx/" method="post">
                <tr>
                  <td>Enable</td>
                  <td>
                    <div class="form-check form-switch">
                      {{ if .Config.InfluxEnable }}
                      <input class="form-check-input" type="checkbox" name="enable" checked>
                      {{ else }}
                      <input class="form-check-input" type="checkbox" name="enable">
                      {{ end }}
                    </div>
                  </td>
                </tr>
                <tr>
                  <td>Address</td>
                  <td><input name="addr" type="text" class="form-control" value="{{ .Config.InfluxAddr }}"></td>
                </tr>
                <tr>
                  <td>Token</td>
                  <td><input name="token" type="text" class="form-control" value="{{ .Config.InfluxToken }}"></td>
                </tr>
                <tr>
                  <td>Org</td>
                  <td><input name="org" type="text" class="form-control" value="{{ .Config.InfluxOrg }}"></td>
                </tr>
                <tr>
                  <td>Bucket</td>
                  <td><input name="bucket" type="text" class="form-control" value="{{ .Config.InfluxBucket }}"></td>
                </tr>
                <tr>
                  <td>Skip TLS verify</td>
                  <td>
                    <div class="form-check form-switch">
                      {{ if .Config.InfluxSkipTLS }}
                      <input class="form-check-input" type="checkbox" name="skip" checked>
                      {{ else }}
                      <input class="form-check-input" type="checkbox" name="skip">
                      {{ end }}
                    </div>
                  </td>
                </tr>
                <tr>
                  <td><button type="submit" class="btn btn-primary">Save</button></td>
                  <td></td>
                </tr>
              </form>
            </table>
          </div>
        </div>

        <div class="card border-primary mt-4 mb-4">
          <div class="card-header">
            About (<a href="https://github.com/aceberg/WatchYourLAN/releases/tag/{{ .Version }}" target="_blank">v{{ .Version }}</a>)
          </div>
          <div class="card-body">
            <p>● After changing <b>Host</b> or <b>Port</b> the app must be restarted</p>
            <p>● <b>Shoutrrr URL</b> provides notifications to Discord, Email, Gotify, Telegram and other services. <a href="https://containrrr.dev/shoutrrr/v0.8/" target="_blank">Link to documentation</a></p>
            <p>● <b>Interfaces</b> - one or more, space separated</p>
            <p>● <b>Timeout (seconds)</b> - time between scans</p>
            <p>● <b>Args for arp-scan</b> - pass your own arguments to <code>arp-scan</code>. Enable <b>debug</b> log level to see resulting command. (Example: <code>-r 1</code>). See <a href="https://github.com/aceberg/WatchYourLAN/blob/main/docs/VLAN_ARP_SCAN.md" target="_blank">docs</a> for more.</p>
            <p>● <b>Arp Strings</b> - can setup scans for <code>vlans</code>, <code>docker0</code> and etcetera. See <a href="https://github.com/aceberg/WatchYourLAN/blob/main/docs/VLAN_ARP_SCAN.md" target="_blank">docs</a> for more.</p>
            <p>● <b>Trim History</b> - remove history after (hours)</p>
            <p>● <b>Store History in DB</b> - if off, the History will be stored only in memory and will be lost on app restart. Though, it will keep the app DB smaller and InfluxDB is recommended for long term History storage</p>
            <p>● <b>PG Connect URL</b> - address to connect to PostgreSQL DB. (Example: <code>postgres://username:password@192.168.0.1:5432/dbname?sslmode=disable</code>). Full list of URL parameters <a href="https://pkg.go.dev/github.com/lib/pq#hdr-Connection_String_Parameters" target="_blank">here</a></p>
            <p>● If you find this app useful, please, <a href="https://github.com/aceberg#donate" target="_blank">donate</a></p>
            <p>● Commission you own app (Golang, HTML/JS, Flutter). Contact <a href="https://github.com/aceberg" target="_blank">here</a></p>
          </div>
        </div>
      </div>
    </div>
  </div>      

{{ template "footer.html" }}
{{ end }}